
// 导入路由
import router from "@/router";
import store from "./store";
// 进度条的包和样式
 import NProgress from 'nprogress' // progress bar
 import 'nprogress/nprogress.css' // progress bar style

import getPageTitle from "./utils/get-page-title";

// to:要去哪里
// from:从哪里来
/* next:他是一个函数. 
        如果直接放行 next()
        如果跳转到其他页面  next(其他页) */
// 页面在进行跳转之前一定会经过这里

// 路由守卫

 // 用数组方法把白名单存进去
const whitelist=['/login','/404']
// 前置守卫
router.beforeEach(async(to,from,next)=>{
    NProgress.start()  //进度条 开始
    console.log('页面在进行跳转之前一定会经过这里');
    console.log('去哪里',to);
    console.log('从哪里来',from);

    // 动态设置网页的标题
    // document.title=`人力资源系统-${to.meta.title}`
    document.title=getPageTitle(to.meta.title)

    // 判断是否有token
 const token=store.state.user.token

 if(token){
    console.log('你已经登录');
    if(to.path==='/login'){
        console.log('已经登录,不能重复登录,直接去首页');
        next('/')
        NProgress.done()  //关闭进度条
    }else{
        console.log('目前是登录状态,访问其他页面  可以放行');
        // 触发axios函数 获取用户信息 存储到vuex中
        // store.dispatch(模块名/actions函数名)   //这里是获取信息 不要传数据
       
        // 判断vuex中是否存储过用户信息, 如果有,就不需要在获取了  这里取反 就需要获取 反则不需要
       if(!store.state.user.userInfo.userId)   {
        // dispatch是异步的所以需要 await
        await store.dispatch('user/getUserInfo') 
       }
        next()
    }
 }else{
    console.log('你没有登录');
    // 用数组方法把白名单存进去  这里调用这个方法
    if(whitelist.includes(to.path)){
        console.log('你拥有白名单,可以直接访问,放行');
        next()
    }else{
        console.log('你没有登录不能访问,请先登录');
        next('/login')
        NProgress.done() //关闭进度条
    }
 }
  
})

//  如何开启进度条NProgress.start()   什么时候开启 页面跳转之前
//  如何关闭进度条NProgress.done()   什么时候关闭 页面加载完毕之前
// 后置守卫
router.afterEach(()=>{
    NProgress.done() //页面跳转完毕 关闭进度条
})


